<template>
	<header class="header">
		<h1>todos</h1>
		<input id="toggle-all" class="toggle-all" type="checkbox" v-model="isAll">
		<label for="toggle-all"></label>
		<input @keyup.enter="add" v-model="content" class="new-todo" placeholder="输入任务名称-回车确认" autofocus />
	</header>
</template>

<script>
	export default {
data(){
return{
	content:''
}
},
		props:{
			arr:{
				type:Array,
			}
		},
		methods:{
			add(){
				this.$emit('add',this.content)
				this.content=''
			},

		},
		computed:{
			isAll:{
				get(){
					if (this.arr.length===0) {
						return false
					}
					this.arr.every(item=>item.isDone)
				},
				set(val){
					this.arr.forEach(item=>item.isAll=VAL)
				}
			}
		}
	}

</script>
